Form Design Workspace
The Form Design workspace is located in the middle of the Form Studio window:
This is the area in which you create and edit the pages which make up a form. Selecting a page in the Project Explorer Pages tab will display the page here. Creating a new page will display an empty page here, which will look like the picture above. For more information about page layouts refer to the Getting Started
The Form Design workspace includes an embedded browser giving you a WYSIWIG display, showing your pages as they will appear within your users' browsers. There may be some slight differences between the workspace display and that of the form when displayed in a user's browser - for example, depending upon the browser used. Also, the dotted lines shown in the picture above, delineating the different sections of the page, will not be displayed in the finished form but are shown in Form Studio to make it easier for you to work with your form.
Right-clicking outside the boundaries of the page in the grey border will display the following menu:
This option, also available by pressing F5, will redraw the current page. If changes you make to the page don't appear to take effect, Refreshing the page may display the changes. If not, try using the Reload option instead. See Reload and Refresh the Form for more information.
Choosing this option from the menu will display the embedded browser's Dev Tools window, which may help if you were to experience problems when designing your form. These are the standard browser Dev Tools available in the most popular browsers by pressing F12.
You can also display the Dev Tools for the embedded browser by choosing Show Dev Tools from the Editor group on the Ribbon's Developer tab.
The Form Design workspace area is also used to create and edit Datasources and to display the built-in Script Editor, which can be used to add custom JavaScript to your form.